<style scoped>
.hui /deep/ .ivu-card-body {
  padding: 0.5vw;
}
</style>

<template>
    <div class="hui" style="margin:0 auto;width: 88%;">
        <h2 style="margin-top: 2vw;">粉丝列表</h2>
        <Card style="margin-top:1vw" v-for="(fan,index) in fans" :key="index">
            <Row>
                <i-col span="4">
                    <img
                        style="width: 3.5vw;margin-top: 0.1vw;margin-left:0.625vw; border-radius: 3vw;border:#2b85e4 2px solid;"
                        :src="fan.picture"
                    >
                </i-col>
                <i-col span="12" style="margin-top:0.8vw">
                    <p
                        style="margin-left: 1vw; margin-top: 0.2vw;font-size: 1.1vw;font-weight: bold;color: #44519E"
                    >{{fan.nickname}}</p>
                </i-col>
                <i-col span="8" style="margin-top:0.8vw">
                    <Button
                        type="primary"
                        style="width:5vw; margin-left:5.5vw"
                        v-on:click="evokeVisitorFilter(fan.id)"
                    >访 问</Button>
                    <!-- <Button type="error" style="width:5vw;margin-left:0.5vw">移 除</Button> -->
                </i-col>
            </Row>
        </Card>
    </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  props: {
    fans: {
      type: Array,
      default: function() {
        return [];
      }
    }
  },
  methods: {
    evokeVisitorFilter(id) {
      this.$store.commit("setVisitorFilter", id);
    }
  }
};
</script>
